<template>
  <div>
    使用其他store中的state
  </div>
  <div>count:{{count}}</div>
  <div>doubleCount:{{doubleCount}}</div>
  <div>doubleCountPlusOne:{{doubleCountPlusOne}}</div>
  <div>composeGetter:{{composeGetter}}</div>
  <button @click="handleCountPlus">count+1</button>
</template>
<script setup lang="ts">
import {useCounterStore} from '@/stores/counter'
import {storeToRefs} from 'pinia'
import {onMounted} from 'vue'
const counterStore = useCounterStore()
const {count,doubleCount,doubleCountPlusOne,composeGetter} = storeToRefs(counterStore)
onMounted(() => {
  console.log('doubleCountPlusOne=',doubleCountPlusOne)
})
function handleCountPlus(){
  count.value = count.value + 1
}
</script>